$(function() {
	if (window.errorMsg) {
		$("#alert-warning").html(window.errorMsg).removeClass("hidden").hide()
				.fadeIn("slow");
		$("#alert-warning").fadeOut(5000);
	}
	
	$('input[type=file]').bootstrapFileInput();

	validationOption = {
		rules : {
			fc : {
				minlength : 2,
				maxlength : 4,
				required : true
			},
			shipMethod : {
				minlength : 2,
				maxlength : 50,
				required : true
			},
			province : {
				minlength : 2,
				maxlength : 20,
				required : true
			},
			city : {
				minlength : 2,
				maxlength : 20,
				required : true
			},
			district : {
				minlength : 2,
				maxlength : 20,
				required : true
			},
			tt : {
				minlength : 1,
				maxlength : 20,
				required : true,
				digits : true
			},
			shipments : {
				minlength : 1,
				maxlength : 20,
				required : true,
				digits : true
			}
		},
		highlight : function(element) {
			$(element).closest('.form-group').addClass('has-error');
		},
		unhighlight : function(element) {
			$(element).closest('.form-group').removeClass('has-error');
		},
		errorElement : 'span',
		errorClass : 'help-block',
		errorPlacement : function(error, element) {
			if (element.parent('.input-group').length) {
				error.insertAfter(element.parent());
			} else {
				error.insertAfter(element);
			}
		}

	};
	$('#addForm').validate(validationOption);
	$('#editForm').validate(validationOption);

	var table = $('#config')
			.DataTable(
					{
						"processing" : true,
						"serverSide" : true,
						"dom" : 'tr<"bottom"ip>',
						"ajax" : {
							"url" : window.basePath + "configuration/list",
							"type" : "POST"
						},
						"language" : {
							"zeroRecords" : "empty list!",
							"infoEmpty" : "No records available",
							"infoFiltered" : "(filtered from _MAX_ total records)"
						},
						"columns" : [
								{
									"data" : "fc"
								},
								{
									"data" : "shipMethod"
								},
								{
									"data" : "province"
								},
								{
									"data" : "city"
								},
								{
									"data" : "district"
								},
								{
									"data" : "tt"
								},
								{
									"data" : "shipments"
								//},
//								{
//									"class" : "details-control",
//									"orderable" : false,
//									"data" : null,
//									"searchable" : false,
//									"defaultContent" : "<button type='button' class='btn btn-success btn-sm'>edit</button>&nbsp;<button type='button' class='btn btn-danger btn-sm'>delete</button>"
							} ]

					});
	$("#searchFc").on('change keyup', function() {
		table.column(0).search(this.value).draw();
	});

	$("#searchShipMethod").on('change keyup', function() {
		table.column(1).search(this.value).draw();
	});
	$("#searchProvince").on('change keyup', function() {
		table.column(2).search(this.value).draw();
	});

	$("#searchCity").on('change keyup', function() {
		table.column(3).search(this.value).draw();
	});

	$("#searchDistrict").on('change keyup', function() {
		table.column(4).search(this.value).draw();
	});

	$("#config tbody").on("click", "button", function() {
		var data = table.row($(this).parents('tr')).data();
		if ($(this).hasClass('btn-success')) {
			$("#fcEdit").val(data.fc);
			$("#shipMethodEdit").val(data.shipMethod);
			$("#provinceEdit").val(data.province);
			$("#cityEdit").val(data.city);
			$("#districtEdit").val(data.district);
			$("#ttEdit").val(data.tt);
			$("#shipmentsEdit").val(data.shipments);
			$("#idEdit").val(data.id);
			$('#editConfigModal').modal('show');

		} else if ($(this).hasClass('btn-danger')) {
			$("#idDelete").val(data.id);
			$('#deleteConfigModal').modal('show');
		}

	});
	$("#addConfig").click(function() {
		$("#createConfigModal").modal('show');
	});

	var provinceSuggestion = new Bloodhound({
		datumTokenizer : Bloodhound.tokenizers.obj.whitespace('provinceName'),
		queryTokenizer : Bloodhound.tokenizers.whitespace,
		limit : 10,
		remote : {
			url : window.basePath + "configuration/suggest/province",
			filter : function(list) {
				return $.map(list, function(province) {
					return {
						provinceName : province
					};
				});
			}
		}
	});

	provinceSuggestion.initialize();

	$('#searchProvince').typeahead('destroy').typeahead(null, {
		name : 'province',
		displayKey : 'provinceName',
		source : provinceSuggestion.ttAdapter()
	});

	var citySuggestion = new Bloodhound({
		datumTokenizer : Bloodhound.tokenizers.obj.whitespace('cityName'),
		queryTokenizer : Bloodhound.tokenizers.whitespace,
		limit : 10,
		remote : {
			url : window.basePath + "configuration/suggest/city/%QUERY",
			filter : function(list) {
				return $.map(list, function(city) {
					return {
						cityName : city
					};
				});
			}
		}
	});

	citySuggestion.initialize();

	$('#searchCity').typeahead('destroy').typeahead(null, {
		name : 'city',
		displayKey : 'cityName',
		source : citySuggestion.ttAdapter()
	});

	var districtSuggestion = new Bloodhound({
		datumTokenizer : Bloodhound.tokenizers.obj.whitespace('districtName'),
		queryTokenizer : Bloodhound.tokenizers.whitespace,
		limit : 10,
		remote : {
			url : window.basePath
					+ "configuration/suggest/district/%QUERY",
			filter : function(list) {
				return $.map(list, function(district) {
					return {
						districtName : district
					};
				});
			}
		}
	});

	districtSuggestion.initialize();

	$('#searchDistrict').typeahead('destroy').typeahead(null, {
		name : 'district',
		displayKey : 'districtName',
		source : districtSuggestion.ttAdapter()
	});
});
